<template>
    <v-form ref="fieldFormRef">
        
    </v-form>
</template>

<script lang="ts" setup>
import { ref, watch, toRaw } from 'vue';

const props = defineProps({
    formType: {
        type: String,
        default: 'add'
    }
})

// 表单
const fieldFormRef = ref<any>(null);

// 表单类型发生变化
watch(() => props.formType, (val) => {
    if (val == "edit") {
        // 记录源数据
        rawData.value = JSON.parse(JSON.stringify(toRaw(formData.value)));
    } else if (val == "view") {
        // 恢复源数据
        formData.value = JSON.parse(JSON.stringify(toRaw(rawData.value)));
    }
})

const rules = {
    required: value => !!value || 'Field is required'
}

// 源数据
const rawData = ref<any>({});
// 表单数据
const formData = ref({
    
})

/**
 * 设置表单数据
 */
function setFormData(data: any = null) {
    
}

/**
 * 验证表单
 */
function validate() {
    return new Promise(async (resolve, reject) => {
        const { valid, errors } = await fieldFormRef.value.validate();
        resolve({ valid, errors });
    })
}

defineExpose({
    formData,
    setFormData,
    resetFormData: () => {
        setFormData(null)
    },
    validate
})

</script>

<style scoped></style>